<!--
 * @FilePath: /vue3-ts-h5-template/src/components/i-svg-icon/index.vue
-->
<script setup lang="ts" name="ISvgIcon">
import { defineProps, computed } from 'vue';
const props = defineProps({
  name: {
    type: String,
    required: true,
    default: ''
  }, // 图标名称
  prefix: {
    type: String,
    default: 'icon'
  }, // 前缀
  color: {
    type: String,
    default: '#333333'
  }, // 颜色
  className: {
    type: String,
    default: ''
  } // 大小
});
// svg 图标名称
const symbolId = computed(() => `#${props.prefix}-${props.name}`);
</script>
<template>
  <svg aria-hidden="true" :class="props.className">
    <use :href="symbolId" :fill="props.color" />
  </svg>
</template>
